<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>视频</title>
    <script src="https://at.alicdn.com/t/font_2005268_hs4e6r1fzp.js"></script>
    <link rel="stylesheet" href="./css/base.css">
    <link rel="stylesheet" href="./css/css.css">
    <link rel="stylesheet" href="./css/video.css">
    <script src="./js/jquery-3.4.1.min.js"></script>
</head>

<body>
    <header>
        <!--  -->
        <div class="container">
            <div class="left" id="btn-drawer">
                <span class="icon-m"></span>
                <span class="icon-m"></span>
                <span class="icon-m"></span>
            </div>
            <div class="middle">
                <img src="./images/logo.png" alt="">
                <svg class="icon" aria-hidden="true">
                    <use xlink:href="#icon-shouji">
                    </use>
                </svg>
            </div>
            <div class="right">
                <span>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-sousuo"></use>
                    </svg>
                </span>
                <a href="./login.html">
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-yonghu"></use>
                    </svg>
                </a>
            </div>
            <!--  -->
            <div class="nav">
                <ul data-nav="header">
                    <li><a href="./index.html">Android</a></li>
                    <li><a href="">iOS</a></li>
                    <li class="active"><a href="">视频</a></li>
                </ul>
            </div>
        </div>
    </header>
    <div class="drawerbox" data-drawer="box">
        <div class="draw-content">
            <p class="btn-return">←</p>
            <ul>
                <li><a href="./index.html">首页</a></li>
                <li><a href="#">排行榜</a></li>
                <li><a href="#">安利墙</a></li>
                <li><a href="#">发现</a></li>
                <li><a href="#">动态</a></li>
            </ul>
        </div>
        <div class="drawer-mask"></div>
    </div>
    <div class="heg"></div>

    <!-- 横向轮播 -->
    <section>
        <div class="review">
            <div class="review-list">
                <div class="swiper" data-swiper="swiper" data-sroll="#swiper-video">
                    <div class="swiper-item">
                        <div class="video-content">
                            <img src="./images/video01.jpg" alt="">
                        </div>
                    </div>
                    <div class="swiper-item">
                        <div class="video-content">
                            <img src="./images/video03.jpg" alt="">
                        </div>
                    </div>
                    <div class="swiper-item">
                        <div class="video-content">
                            <img src="./images/video02.jpg" alt="">
                        </div>
                    </div>
                    <div class="swiper-item">
                        <div class="video-content">
                            <img src="./images/video04.jpg" alt="">
                        </div>
                    </div>
                    <div class="swiper-item">
                        <div class="video-content">
                            <img src="./images/video02.jpg" alt="">
                        </div>
                    </div>
                    <div class="swiper-item">
                        <div class="video-content">
                            <img src="./images/video03.jpg" alt="">
                        </div>
                    </div>
                    <div class="swiper-item">
                        <div class="video-content">
                            <img src="./images/video01.jpg" alt="">
                        </div>
                    </div>
                    <div class="swiper-item">
                        <div class="video-content">
                            <img src="./images/video01.jpg" alt="">
                        </div>
                    </div>
                    <div class="swiper-item">
                        <div class="video-content">
                            <img src="./images/video01.jpg" alt="">
                        </div>
                    </div>
                    <div class="swiper-item">
                        <div class="video-content">
                            <img src="./images/video01.jpg" alt="">
                        </div>
                    </div>
                    <div class="swiper-item">
                        <div class="video-content">
                            <img src="./images/video01.jpg" alt="">
                        </div>
                    </div>
                </div>
                <div class="swipersroll" id="swiper-video">
                    <div class="swipersroll-item"></div>
                </div>
            </div>
        </div>
    </section>
    <!-- 视频 -->
    <section>
        <div class="recommend-container">
            <h2 class="recommend-title">为你推荐</h2>
            <div class="recommend-content">
                <div class="content-decribe">
                    <div class="decribe-video">
                        <img src="./images/videoplay.png" alt="">
                        <div class="video-time">11:30</div>
                    </div>
                    <div class="decribe-content">
                        <div class="decribe-logo">
                            <img src="./images/tubiao-yuanshen.png" alt="">
                        </div>
                        <div class="decribe-test">
                            <p class="decribe-title">【白痴毛】最优秀又最贪心的手游，原神三测测评（转载）</p>
                            <p class="decribe-info">
                                <a href="#"></a>
                                <span>工藤新二</span>
                                <span>.</span>
                                <span>07-30</span>
                                <span>.</span>
                                <span>1万+ 播放</span>
                            </p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="recommend-content">
                <div class="content-decribe">
                    <div class="decribe-video">
                        <img src="./images/videoplay.png" alt="">
                        <div class="video-time">11:30</div>
                    </div>
                    <div class="decribe-content">
                        <div class="decribe-logo">
                            <img src="./images/tubiao-yuanshen.png" alt="">
                        </div>
                        <div class="decribe-test">
                            <p class="decribe-title">【白痴毛】最优秀又最贪心的手游，原神三测测评（转载）</p>
                            <p class="decribe-info">
                                <a href="#"></a>
                                <span>工藤新二</span>
                                <span>.</span>
                                <span>07-30</span>
                                <span>.</span>
                                <span>1万+ 播放</span>
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- 悬浮窗 -->
    <div class="suspended-window">
        <svg class="icon" aria-hidden="true">
            <use xlink:href="#icon-shipin">
            </use>
        </svg>
    </div>
    <!-- 底部 -->
    <footer>
        <div class="container">
            <p>Contact Us</p>
            <ul class="list-logo">
                <li><a href="#"> <svg class="icon" aria-hidden="true">
                            <use xlink:href="#icon-facebook3">
                            </use>
                        </svg></a></li>
                <li><a href="#"> <svg class="icon" aria-hidden="true">
                            <use xlink:href="#icon-weixin">
                            </use>
                        </svg></a></li>
                <li><a href="#"> <svg class="icon" aria-hidden="true">
                            <use xlink:href="#icon-qq">
                            </use>
                        </svg></a></li>
                <li><a href="#"> <svg class="icon" aria-hidden="true">
                            <use xlink:href="#icon-zhihu0">
                            </use>
                        </svg></a></li>
                <li><a href="#"> <svg class="icon" aria-hidden="true">
                            <use xlink:href="#icon-weibo">
                            </use>
                        </svg></a></li>
                <li><a href="#"> <svg class="icon" aria-hidden="true">
                            <use xlink:href="#icon-mail4">
                            </use>
                        </svg></a></li>
            </ul>
            <p><span class="red">TapTap 四周年 </span>2019年度游戏大赏 簧火计划
            </p>
            <div class="logo"><img src="./images/logo2.png" alt=""></div>
            <div class="dropdown">
                <button>中文(简体)</button>
                <span>
                    <svg class="icon" aria-hidden="true">
                        <use xlink:href="#icon-xia1">
                        </use>
                    </svg>
                </span>
            </div>
            <ul class="lisk">
                <li><a href="">开发者中心</a></li>
                <li><a href="">广告投放</a></li>
                <li><a href="">关于我们</a></li>
                <li><a href="">加入我们</a></li>
                <li><a href="">用户认证</a></li>
            </ul>
            <p class="bigp">Discover Superb Games.</p>
            <div class="text">
                <p>Copyright G 2020 TapTap. AI rights Reserved.</p>
                <p>适龄提示本公司产品适合10周岁以上玩家使用</p>
                <p>未成年人家长监护隐私政策侵权投诉</p>
                <p>沪ICP备16012525号-1沪网文(2019)3544-255号</p>
                <p>经营许可证编号:沪B2 20170322</p>
                <p>易玩(上海)网络科技有限公司</p>
                <p>公司地址:上海市静安区万荣路700号A3 202</p>
                <p>注册地址:上海市闵行区紫星路588号2幢2122室</p>
            </div>
        </div>
    </footer>

</body>
<script src="./js/swiper.js"></script>
<script src="./js/base.js"></script>
<script>
    $(function () {
        $('[data-swiper="swiper"]').myswiper();
    }) 
</script>

</html>